<!--
 * @Author: zsc
 * @Date: 2022-06-13 21:56:52
 * @LastEditors: zsc
 * @LastEditTime: 2022-06-26 14:20:36
 * @Description:
-->

<template>
  <div class="app-container">
    <!--    功能-->
    <!--    查询条件-->
    <el-card class="app-container-tools">
      <div class="app-container-tools-search">
        <span>楼宇名称：</span>
        <el-input v-model="WHERE.search" class="k-width-150-p k-mr-10" />
        <el-button type="primary" @click="_search">查询</el-button>
        <el-button type="primary" @click="_reset">重置</el-button>
      </div>
      <div class="app-container-tools-action">
        <el-button v-permission="['BD:BUILDING:ADD']" type="primary" style=" margin-left: 10px" @click="handleCreate">新增</el-button>
        <!--        <el-button v-permission="['BD:BUILDING:IMPORT']" style=" margin-left: 10px" @click="handleImport">导入</el-button>-->
      </div>
    </el-card>

    <el-card>
      <!--    表格-->
      <el-table
        ref="tb"
        v-loading="LOADING"
        :data="TABLE_DATA"
        :size="SIZE"
        border
        :height="LIST_HEIGHT"
        style="width: 100%"
        @selection-change="_handleSelectionChange"
      >
        <el-table-column
          type="selection"
          width="55"
        />
        <template v-for="(item) in setting">
          <el-table-column
            v-if="item.key === 'action'"
            :key="item.id"
            :label="item.name"
            :prop="item.key"
            :width="item.value"
          >
            <template slot-scope="scope">
              <el-button @click="handleScan(scope.row)">楼宇资料</el-button>
              <el-button @click="handleGate(scope.row)">闸机管理</el-button>
              <el-button>人流状态</el-button>
              <el-button @click="handleCompany(scope.row)">企业状态</el-button>
              <el-button>楼宇码</el-button>
              <el-button v-permission="['BD:BUILDING:EDIT']" @click="handleEdit(scope.row)">编辑</el-button>
              <el-button v-permission="['BD:BUILDING:DEL']" @click="handleDel(scope.row)">删除</el-button>
            </template>

          </el-table-column>
          <el-table-column
            v-else-if="item.key === 'area'"
            :key="item.id"
            :label="item.name"
            :prop="item.key"
            :width="item.value"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.region_info.province+'/'+scope.row.region_info.city+'/'+scope.row.region_info.county+'/' }}</span>
            </template>

          </el-table-column>
          <el-table-column
            v-else
            :key="item.id"
            :label="item.name"
            :prop="item.key"
            :width="item.value"
          />
        </template>
      </el-table>
      <!--    分页-->
      <pagination />
      <!--    弹窗-->
      <form-modal :visible.sync="FORM_VISIBLE" :type="FORM_TYPE" :data="FORM_DATA" @refresh="_search" />
      <gate-modal :visible.sync="gateVisible" :data="gateData" />
      <scan-modal :visible.sync="scanVisible" :data="scanData" />
      <company-modal :visible.sync="companyVisible" :building-id="companyData" />
    </el-card>
  </div>
</template>

<script>
import list from '@/list'
import BuildingClass from '@/models/building-class'
import { buildingGetList, buildingDel } from '@/api/building'
import formModal from './components/form'
import gateModal from './components/gate'
import scanModal from './components/scan'
import companyModal from './components/companyList.vue'
const buildingClass = new BuildingClass()
export default {
  name: 'DeepInterpretationOrder',
  components: { formModal, gateModal, scanModal, companyModal },
  mixins: [list],
  data() {
    return {
      gateVisible: false,
      gateData: '',
      scanVisible: false,
      scanData: 0,
      companyVisible: false,
      companyData: 0,
      caseRequestURLType: '',
      setting: buildingClass.list(),
      WHERE: {
        buildingName: '' // 访问类型
      }
    }
  },
  created() {
    this.LIST_API = buildingGetList
  },
  mounted() {
  },
  methods: {
    handleCreate() {
      console.log('添加')
      this.FORM_TYPE = 'create'
      this.FORM_VISIBLE = true
      this.FORM_DATA = {}
    },
    handleEdit(item) {
      console.log('更新')
      this.FORM_TYPE = 'edit'
      this.FORM_VISIBLE = true
      this.FORM_DATA = item
    },
    handleScan(item) {
      console.log('楼宇资料')
      this.scanVisible = true
      this.scanData = item.id
    },
    handleCompany(item) {
      console.log('企业列表')
      this.companyVisible = true
      this.companyData = item.id
    },
    handleImport() {
      console.log('导入')
      this.$notify.success('导入')
    },
    handleDel(item) {
      this.$confirm('确认删除？')
        .then(_ => {
          buildingDel(item.id).then(p => {
            this._showSuccess('删除成功')
            this._search()
          })
        })
        .catch(_ => {
        })
      console.log('删除', item)
    },
    handleGate(item) {
      console.log('闸机管理', item)
      this.gateVisible = true
      this.gateData = item.id
    }
  }
}
</script>
<style lang="scss">
 @import '@/styles/list/index.scss';
</style>
